import React from 'react'
import {
    Form,
    Input,
    Button,
} from 'antd-mobile'
import { loginApi } from '../../api'
import { useNavigate } from 'react-router-dom'
import useDebounce from '../../hooks/useDebounce'
function Index() {
    const navigate = useNavigate()
    const onFinish = async (values) => {
        const resp = await loginApi(values)
        const { code, data, message } = resp.data
        if (code === 200) {
            alert(message)
            navigate('/home')

        }

    }
    return (
        <div>
            <Form
                layout='horizontal'
                onFinish={onFinish}
                footer={
                    <Button block type='submit' color='primary' size='large'>
                        提交
                    </Button>
                }
            >

                <Form.Item

                    name='username'
                    label='手机号'
                    rules={[{ required: true, message: '手机号不能为空' }]}
                >
                    <Input onChange={console.log} placeholder='请输入手机号' />
                </Form.Item>
                <Form.Item
                    name='password'
                    label='验证码'
                    rules={[{ required: true, message: '验证码不能为空' }]}
                >
                    <Input onChange={console.log} placeholder='请输入验证码' />
                </Form.Item>

            </Form>

        </div>
    )
}

export default Index